﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CalendarExtenderMk2Sample.aspx.cs" Inherits="CalendarExtenderSample._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <%-- Toolkit Script Manager --%>
        <atc:ToolkitScriptManager runat="server" ID="ToolKitScriptManager"
                                  EnablePartialRendering="true"
                                  EnablePageMethods="true"
                                  CombineScripts="false">
        </atc:ToolkitScriptManager>

        <table width="100%">
            <tr>
                <td align="center" valign="middle" width="100%">
                    <table width="75%" border="1">
                        <%-- Stock ASP.NET AJAX CalendarExtender --%>
                        <tr>
                            <td align="left" width="500px">
                                Stock Ajax Control Toolkit Calendar Extender:
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtStockCalendarExtender" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnStockCalendarExtender"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- KSharp CalendarExtenderMk2 (Default Behavior) --%>
                        <tr>
                            <td align="left" width="500px">
                                Calendar Extender mk.2 (Default Behavior):
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2DefaultBehavior" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2DefaultBehavior"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- KSharp CalendarExtenderMk2 (Past Dates Only) --%>
                        <tr>
                            <td align="left" width="500px">
                                Calendar Extender mk.2 (Past Dates Only):
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2PastDates" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2PastDates"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- KSharp CalendarExtenderMk2 (Future Dates Only) --%>
                        <tr>
                            <td align="left" width="500px">
                                Calendar Extender mk.2 (Future Dates Only):
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2FutureDates" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2FutureDates"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- KSharp CalendarExtenderMk2 (Selectible within a Date Range with default earliest and latest dates) --%>
                        <tr>
                            <td align="left" width="500px">
                                Calendar Extender mk.2 (Selectible within a Date Range with default earliest and latest dates):
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2DateRangeDef" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2DateRangeDef"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- KSharp CalendarExtenderMk2 (Selectible within a Date Range with earliest and latest dates set at 
                                                         Design Time) --%>
                        <tr>
                            <td align="left" width="500px">
                                CalendarExtender mk.2 (Selectible within a Date Range with earliest and latest dates set at Design Time
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2DateRange" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2DateRange"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <hr />
        <table width="100%">
            <tr>
                <td align="center" valign="middle" width="100%">
                    <table width="75%" border="0">
                        <tr>
                            <td colspan="2" align="left">
                                More advanced uses of the CalendarExtender mk.2...
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <%-- Tying a CalendarExtenderMk2 to another --%>
            <tr>
                <td align="center" valign="middle" width="100%">
                    <table width="75%" border="1">
                        <tr>
                            <td colspan="2" align="left">
                                Tying a CalendarExtenderMk2 to another:
                            </td>
                        </tr>
                        <%-- Parent Calendar (Determines Earliest Selectible Date) --%>
                        <tr>
                            <td align="left" width="500px" valign="top">
                                Parent Calendar (Determines Earliest Selectible Date):  
                            </td>
                            <td align="left" width="500px" >
                                <asp:TextBox runat="Server" ID="txtMk2EarliestParent" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2EarliestParent"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- Parent Calendar (Determines Latest Selectible Date) --%>
                        <tr>
                            <td align="left" width="500px" valign="top">
                                Parent Calendar (Determines Latest Selectible Date):  
                            </td>
                            <td align="left" width="500px" >
                                <asp:TextBox runat="Server" ID="txtMk2LatestParent" 
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2LatestParent"
                                                 ImageUrl="~/Images/icon_calendar.gif" 
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                        <%-- Child Calendar (Remains disbled until both parents have selected dates) --%>
                        <tr>
                            <td align="left" width="500px" valign="top">
                                Child Calendar (Remains disbled until both parents have selected dates):
                            </td>
                            <td align="left" width="500px">
                                <asp:TextBox runat="Server" ID="txtMk2Child" 
                                             Enabled="false"
                                             ReadOnly="true"
                                             Width="100px">
                                </asp:TextBox>
                                <asp:ImageButton runat="server" ID="imgBtnMk2Child"
                                                 ImageUrl="~/Images/icon_calendar_disabled.gif" 
                                                 Style="cursor:default;"
                                                 OnClientClick="return false;" />
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table> 

        <%-- ASP.NET AJAX Control Toolkit Extenders --%>
        <atc:CalendarExtender runat="server" id="ceStockCalendarExtender"
                              TargetControlID="txtStockCalendarExtender"
                              PopupButtonID="imgBtnStockCalendarExtender"
                              PopupPosition="TopRight"
                              Format="yyyy/MMM/dd">            
        </atc:CalendarExtender>
        
        <%-- KSharp Extender Controls --%>
        <KSharp:CalendarExtenderMk2 runat="server" id="ceMk2DefaultBehavior"
                                    TargetControlID="txtMk2DefaultBehavior"
                                    PopupButtonID="imgBtnMk2DefaultBehavior"
                                    PopupPosition="TopRight"
                                    Format="yyyy/MMM/dd">
        </KSharp:CalendarExtenderMk2>    
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2PastDates"
                                    TargetControlID="txtMk2PastDates"
                                    PopupButtonID="imgBtnMk2PastDates"
                                    PopupPosition="TopRight"
                                    SelectibleDates="OnlyPastDates"
                                    Format="yyyy/MMM/dd">
        </KSharp:CalendarExtenderMk2>  
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2FutureDates"
                                    TargetControlID="txtMk2FutureDates"
                                    PopupButtonID="imgBtnMk2FutureDates"
                                    PopupPosition="TopRight"
                                    SelectibleDates="OnlyFutureDates"
                                    Format="yyyy/MMM/dd">
        </KSharp:CalendarExtenderMk2>  
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2DateRangeDef"
                                    TargetControlID="txtMk2DateRangeDef"
                                    PopupButtonID="imgBtnMk2DateRangeDef"
                                    PopupPosition="TopRight"
                                    SelectibleDates="OnlyWithinSpecifiedRange"
                                    Format="yyyy/MMM/dd">
        </KSharp:CalendarExtenderMk2> 
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2DateRange"
                                    TargetControlID="txtMk2DateRange"
                                    PopupButtonID="imgBtnMk2DateRange"
                                    PopupPosition="TopRight"
                                    SelectibleDates="OnlyWithinSpecifiedRange"
                                    EarliestSelectibleDate="2010/01/01"
                                    LatestSelectibleDate="2010/01/31"
                                    SelectedDate="2010/01/01"
                                    Format="yyyy/MMM/dd">
        </KSharp:CalendarExtenderMk2> 
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2EarliestParent"
                                    BehaviorID="ceMk2EarliestParentBID"
                                    TargetControlID="txtMk2EarliestParent"
                                    PopupButtonID="imgBtnMk2EarliestParent"
                                    PopupPosition="TopRight"
                                    Format="yyyy/MMM/dd"
                                    OnClientDateSelectionChanged="ceMk2EarliestParent_ClientDateSelectionChanged">
        </KSharp:CalendarExtenderMk2>
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2LatestParent"
                                    BehaviorID="ceMk2LatestParentBID"
                                    TargetControlID="txtMk2LatestParent"
                                    PopupButtonID="imgBtnMk2LatestParent"
                                    PopupPosition="TopRight"
                                    Format="yyyy/MMM/dd"
                                    OnClientDateSelectionChanged="ceMk2LatestParent_ClientDateSelectionChanged">
        </KSharp:CalendarExtenderMk2>
        <KSharp:CalendarExtenderMk2 runat="server" ID="ceMk2Child"
                                    BehaviorID="ceMk2ChildBID"
                                    TargetControlID="txtMk2Child"
                                    PopupButtonID="imgBtnMk2Child"
                                    PopupPosition="TopRight"
                                    Format="yyyy/MMM/dd"
                                    EnabledOnClient="false">
        </KSharp:CalendarExtenderMk2>
        
        <script type="text/javascript" language="javascript">
        
            function ceMk2EarliestParent_ClientDateSelectionChanged(sender, args)
            {
                SetChildCalendarControl(sender, null);   
            }

            function ceMk2LatestParent_ClientDateSelectionChanged(sender, args) 
            {
                SetChildCalendarControl(null, sender);
            }

            function SetChildCalendarControl(ceMk2EarliestParent, ceMk2LatestParent) 
            {
                var ceMk2Child = $find('<%=ceMk2Child.BehaviorID %>');
                var txtMk2Child = document.getElementById('<%=txtMk2Child.ClientID %>');
                var imgBtnMk2Child = document.getElementById('<%=imgBtnMk2Child.ClientID %>');

                ceMk2EarliestParent = (ceMk2EarliestParent == null ? $find('<%=ceMk2EarliestParent.BehaviorID %>') : ceMk2EarliestParent);
                ceMk2LatestParent = (ceMk2LatestParent == null ? $find('<%=ceMk2LatestParent.BehaviorID %>') : ceMk2LatestParent);

                if (ceMk2EarliestParent != null && ceMk2LatestParent != null && ceMk2Child != null && txtMk2Child != null && imgBtnMk2Child != null) 
                {
                    ceMk2Child.set_earliestSelectibleDate(ceMk2EarliestParent.get_selectedDate());
                    ceMk2Child.set_latestSelectibleDate(ceMk2LatestParent.get_selectedDate());
                    ceMk2Child.set_selectibleDates(KSharp.AjaxControlToolkit.SelectibleDates.OnlyWithinSpecifiedRange);

                    if (ceMk2EarliestParent.get_selectedDate() != null && ceMk2LatestParent.get_selectedDate() != null)
                    {
                        imgBtnMk2Child.src = '<%=new Control().ResolveUrl("~//Images//icon_calendar.gif")%>';
                        imgBtnMk2Child.style.cursor = 'pointer';
                        txtMk2Child.disabled = false;
                        ceMk2Child.set_enabled(true);
                    }
                }
            }
        </script>
    </form>
</body>
</html>
